<template>
  <div>
    <div class="name">
      <span class="title">{{ course.name }}</span>
      <van-tag plain round type="primary" size="large" @click="toEdit">编辑</van-tag>
    </div>
    <van-cell-group>
      <van-cell title="学生姓名" :value="course.student"/>
      <van-cell title="上课时间" :value="course.time"/>
      <van-cell title="上课地点" :value="course.address"/>
    </van-cell-group>
    <div class="button">
      <van-button type="info" size="large">排课</van-button>
      <van-button type="info" size="large" to="/courseAssess">评价</van-button>
      <van-button type="info" size="large">签到</van-button>
      <van-button type="info" size="large">临时调课</van-button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'course-detail',
  data () {
    return {
      course: {
        name: '古筝课',
        student: '张三',
        time: '周一，9:00-10:00',
        address: '广州市天河区体育西路'
      }
    }
  },
  methods: {
    toEdit () {
      this.$router.push('/editCourse')
    }
  },
  created () {
  }
}
</script>

<style scoped>
  .name{
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .name .title{
    font-size: 18px;
  }
  .button{
    margin-top: 20px;
    padding: 15px;
  }
  .button button{
    margin-bottom: 16px;
  }
</style>
